/**
 * 详细信息标签
 */

import { loadVue } from '../js/loadHtml.js'
import { createLableObject } from '../js/labelObject.js'

let vue = undefined;

async function createInfoLabel(sc, scene) {
    if (vue) return vue;

    await loadVue('views/infoLabel.vue', 'infoLabelContainer');

    vue = new Vue({
        el: "#infoLabelContainer",
        created() {

        },
        mounted() {

        },
        data() {
            return {
                visible: false,
                meshName: '',
                marginRight: { 'margin-right': '300px' },
                clickPoint: { x: 0, y: 0, z: 0 },
                meshCenter: { x: 0, y: 0, z: 0 }
            };
        },
        methods: {
            async show(id, position) {
                this.visible = true;
                let pointLabel = createLableObject('#infoLabelContainer', position, sc);
                scene.add(pointLabel);
                setTimeout(() => {
                    this.marginRight = { 'margin-right': ($('#infoLabel').width() + 20) + 'px' };
                }, 10);
            },
            close() {
                this.visible = false;
            }
        }
    });

    window.infoLabel = vue;
    return vue;
}

export { createInfoLabel }